.callout {
  background-image: linear-gradient(#ecdfd6 50%, #c1ac8f 98%);
}

.secondary-callout {
  // These are both derived from $brand-color
  // background-image: linear-gradient(#dbe9fa 50%, #86b3ee 98%)
  background-color: rgb(163, 200, 199);
}

.callout,
.secondary-callout,
.hero {
  margin-bottom: 15px;
  padding: 10px 40px;
}

.callout,
.secondary-callout {
  border: 1px solid rgb(50, 85, 143);

  h2,
  h3 {
    font-weight: bold;
  }

  .pop {
    color: rgb(254, 229, 153);
    text-shadow: 1px 1px 2px #444;
  }
}

.secondary-callout {
  h2 {
    margin-bottom: 5px;
  }
  h3 {
    margin-bottom: 25px;
  }
  img {
    float: left;
  }
}

.key-value-table {
  margin: 0 auto 20px;
}

.key-value-table th {
  text-align: right;
  padding-right: 5px;
  white-space: nowrap;
  vertical-align: top;
}
.key-value-table + p {
  margin-top: 24px;
}
.key-value-table td {
  vertical-align: top;
}

.donate-strong {
  font-size: 120%;
  font-weight: bold;
  color: #2b3c69;
}

.column-for-donorbox {
  padding-right: 10px;
  width: calc(50% - 10px);
}

.pt-2 { padding-top: .5rem !important; }